
<!DOCTYPE html>
<html>
<head>
    <meta charset="utf-8"/>
    <title>IconFont</title>
    <link rel="stylesheet" href="demo.css">
    <link rel="stylesheet" href="iconfont.css">
</head>
<body>
    <div class="main markdown">
        <h1>IconFont 图标</h1>
        <ul class="icon_lists clear">
            
                <li>
                <i class="icon iconfont icon-dianhua"></i>
                    <div class="name">电话</div>
                    <div class="fontclass">.icon-dianhua</div>
                </li>
            
                <li>
                <i class="icon iconfont icon-phone"></i>
                    <div class="name">电话</div>
                    <div class="fontclass">.icon-phone</div>
                </li>
            
                <li>
                <i class="icon iconfont icon-wenhao1"></i>
                    <div class="name">问号</div>
                    <div class="fontclass">.icon-wenhao1</div>
                </li>
            
                <li>
                <i class="icon iconfont icon-shanchu"></i>
                    <div class="name">删除</div>
                    <div class="fontclass">.icon-shanchu</div>
                </li>
            
                <li>
                <i class="icon iconfont icon-guanbi"></i>
                    <div class="name">关闭</div>
                    <div class="fontclass">.icon-guanbi</div>
                </li>
            
                <li>
                <i class="icon iconfont icon-dianhua1"></i>
                    <div class="name">电话</div>
                    <div class="fontclass">.icon-dianhua1</div>
                </li>
            
                <li>
                <i class="icon iconfont icon-tuichu2"></i>
                    <div class="name">退出</div>
                    <div class="fontclass">.icon-tuichu2</div>
                </li>
            
                <li>
                <i class="icon iconfont icon-shouji"></i>
                    <div class="name">手机</div>
                    <div class="fontclass">.icon-shouji</div>
                </li>
            
                <li>
                <i class="icon iconfont icon-weibiaoti1"></i>
                    <div class="name">weixin</div>
                    <div class="fontclass">.icon-weibiaoti1</div>
                </li>
            
                <li>
                <i class="icon iconfont icon-unie664"></i>
                    <div class="name">搜索</div>
                    <div class="fontclass">.icon-unie664</div>
                </li>
            
                <li>
                <i class="icon iconfont icon-weibo"></i>
                    <div class="name">weibo</div>
                    <div class="fontclass">.icon-weibo</div>
                </li>
            
                <li>
                <i class="icon iconfont icon-icon"></i>
                    <div class="name">关闭</div>
                    <div class="fontclass">.icon-icon</div>
                </li>
            
                <li>
                <i class="icon iconfont icon-kongjian"></i>
                    <div class="name">空间</div>
                    <div class="fontclass">.icon-kongjian</div>
                </li>
            
                <li>
                <i class="icon iconfont icon-24"></i>
                    <div class="name">文章</div>
                    <div class="fontclass">.icon-24</div>
                </li>
            
                <li>
                <i class="icon iconfont icon-35"></i>
                    <div class="name">收藏</div>
                    <div class="fontclass">.icon-35</div>
                </li>
            
                <li>
                <i class="icon iconfont icon-weibo1"></i>
                    <div class="name">weibo</div>
                    <div class="fontclass">.icon-weibo1</div>
                </li>
            
                <li>
                <i class="icon iconfont icon-weibo2"></i>
                    <div class="name">weibo</div>
                    <div class="fontclass">.icon-weibo2</div>
                </li>
            
                <li>
                <i class="icon iconfont icon-icon47"></i>
                    <div class="name">收藏</div>
                    <div class="fontclass">.icon-icon47</div>
                </li>
            
                <li>
                <i class="icon iconfont icon-xiangji"></i>
                    <div class="name">相机</div>
                    <div class="fontclass">.icon-xiangji</div>
                </li>
            
                <li>
                <i class="icon iconfont icon-usericon"></i>
                    <div class="name">用户</div>
                    <div class="fontclass">.icon-usericon</div>
                </li>
            
                <li>
                <i class="icon iconfont icon-yonghu"></i>
                    <div class="name">用户</div>
                    <div class="fontclass">.icon-yonghu</div>
                </li>
            
                <li>
                <i class="icon iconfont icon-sousuo"></i>
                    <div class="name">搜索</div>
                    <div class="fontclass">.icon-sousuo</div>
                </li>
            
                <li>
                <i class="icon iconfont icon-shangchuan"></i>
                    <div class="name">上传</div>
                    <div class="fontclass">.icon-shangchuan</div>
                </li>
            
                <li>
                <i class="icon iconfont icon-guanbi1"></i>
                    <div class="name">关闭</div>
                    <div class="fontclass">.icon-guanbi1</div>
                </li>
            
                <li>
                <i class="icon iconfont icon-xiugaiziliaoicon"></i>
                    <div class="name">修改资料</div>
                    <div class="fontclass">.icon-xiugaiziliaoicon</div>
                </li>
            
                <li>
                <i class="icon iconfont icon-sousuo1"></i>
                    <div class="name">搜索</div>
                    <div class="fontclass">.icon-sousuo1</div>
                </li>
            
                <li>
                <i class="icon iconfont icon-qia"></i>
                    <div class="name">卡</div>
                    <div class="fontclass">.icon-qia</div>
                </li>
            
                <li>
                <i class="icon iconfont icon-guanbi2"></i>
                    <div class="name">关闭_</div>
                    <div class="fontclass">.icon-guanbi2</div>
                </li>
            
                <li>
                <i class="icon iconfont icon-shoucang"></i>
                    <div class="name">收藏</div>
                    <div class="fontclass">.icon-shoucang</div>
                </li>
            
                <li>
                <i class="icon iconfont icon-jiazai"></i>
                    <div class="name">加载</div>
                    <div class="fontclass">.icon-jiazai</div>
                </li>
            
                <li>
                <i class="icon iconfont icon-hongbao"></i>
                    <div class="name">红包</div>
                    <div class="fontclass">.icon-hongbao</div>
                </li>
            
                <li>
                <i class="icon iconfont icon-shijian"></i>
                    <div class="name">时间</div>
                    <div class="fontclass">.icon-shijian</div>
                </li>
            
                <li>
                <i class="icon iconfont icon-shoucang1"></i>
                    <div class="name">收藏</div>
                    <div class="fontclass">.icon-shoucang1</div>
                </li>
            
                <li>
                <i class="icon iconfont icon-tuichu"></i>
                    <div class="name">退出</div>
                    <div class="fontclass">.icon-tuichu</div>
                </li>
            
                <li>
                <i class="icon iconfont icon-shijian1"></i>
                    <div class="name">时间</div>
                    <div class="fontclass">.icon-shijian1</div>
                </li>
            
                <li>
                <i class="icon iconfont icon-bianji"></i>
                    <div class="name">编辑</div>
                    <div class="fontclass">.icon-bianji</div>
                </li>
            
                <li>
                <i class="icon iconfont icon-icon1"></i>
                    <div class="name">数据</div>
                    <div class="fontclass">.icon-icon1</div>
                </li>
            
                <li>
                <i class="icon iconfont icon-bianji1"></i>
                    <div class="name">编辑</div>
                    <div class="fontclass">.icon-bianji1</div>
                </li>
            
                <li>
                <i class="icon iconfont icon-apple"></i>
                    <div class="name">苹果</div>
                    <div class="fontclass">.icon-apple</div>
                </li>
            
                <li>
                <i class="icon iconfont icon-kongjian1"></i>
                    <div class="name">空间</div>
                    <div class="fontclass">.icon-kongjian1</div>
                </li>
            
                <li>
                <i class="icon iconfont icon-fenxiang"></i>
                    <div class="name">分享</div>
                    <div class="fontclass">.icon-fenxiang</div>
                </li>
            
                <li>
                <i class="icon iconfont icon-dianhua2"></i>
                    <div class="name">电话</div>
                    <div class="fontclass">.icon-dianhua2</div>
                </li>
            
                <li>
                <i class="icon iconfont icon-fenxiang1"></i>
                    <div class="name">分享</div>
                    <div class="fontclass">.icon-fenxiang1</div>
                </li>
            
                <li>
                <i class="icon iconfont icon-hua"></i>
                    <div class="name">花</div>
                    <div class="fontclass">.icon-hua</div>
                </li>
            
                <li>
                <i class="icon iconfont icon-fankui"></i>
                    <div class="name">退出</div>
                    <div class="fontclass">.icon-fankui</div>
                </li>
            
                <li>
                <i class="icon iconfont icon-shuju"></i>
                    <div class="name">数据</div>
                    <div class="fontclass">.icon-shuju</div>
                </li>
            
                <li>
                <i class="icon iconfont icon-kongjian2"></i>
                    <div class="name">空间</div>
                    <div class="fontclass">.icon-kongjian2</div>
                </li>
            
                <li>
                <i class="icon iconfont icon-fenxiang2"></i>
                    <div class="name">分享</div>
                    <div class="fontclass">.icon-fenxiang2</div>
                </li>
            
                <li>
                <i class="icon iconfont icon-xianhua"></i>
                    <div class="name">鲜花</div>
                    <div class="fontclass">.icon-xianhua</div>
                </li>
            
                <li>
                <i class="icon iconfont icon-shanchu1"></i>
                    <div class="name">删除</div>
                    <div class="fontclass">.icon-shanchu1</div>
                </li>
            
                <li>
                <i class="icon iconfont icon-shanchu2"></i>
                    <div class="name">删除</div>
                    <div class="fontclass">.icon-shanchu2</div>
                </li>
            
                <li>
                <i class="icon iconfont icon-qq"></i>
                    <div class="name">qq</div>
                    <div class="fontclass">.icon-qq</div>
                </li>
            
                <li>
                <i class="icon iconfont icon-qq1"></i>
                    <div class="name">qq</div>
                    <div class="fontclass">.icon-qq1</div>
                </li>
            
                <li>
                <i class="icon iconfont icon-jiazai1"></i>
                    <div class="name">加载</div>
                    <div class="fontclass">.icon-jiazai1</div>
                </li>
            
                <li>
                <i class="icon iconfont icon-xiazai"></i>
                    <div class="name">下载</div>
                    <div class="fontclass">.icon-xiazai</div>
                </li>
            
                <li>
                <i class="icon iconfont icon-icon11"></i>
                    <div class="name">退出</div>
                    <div class="fontclass">.icon-icon11</div>
                </li>
            
                <li>
                <i class="icon iconfont icon-lianjie"></i>
                    <div class="name">链接</div>
                    <div class="fontclass">.icon-lianjie</div>
                </li>
            
                <li>
                <i class="icon iconfont icon-right_line"></i>
                    <div class="name">正确</div>
                    <div class="fontclass">.icon-right_line</div>
                </li>
            
                <li>
                <i class="icon iconfont icon-shijian2"></i>
                    <div class="name">时间</div>
                    <div class="fontclass">.icon-shijian2</div>
                </li>
            
                <li>
                <i class="icon iconfont icon-buxianshi01"></i>
                    <div class="name">不显示</div>
                    <div class="fontclass">.icon-buxianshi01</div>
                </li>
            
                <li>
                <i class="icon iconfont icon-yonghu1"></i>
                    <div class="name">用户</div>
                    <div class="fontclass">.icon-yonghu1</div>
                </li>
            
                <li>
                <i class="icon iconfont icon-chevron-copy"></i>
                    <div class="name">箭头</div>
                    <div class="fontclass">.icon-chevron-copy</div>
                </li>
            
                <li>
                <i class="icon iconfont icon-shuju1"></i>
                    <div class="name">数据</div>
                    <div class="fontclass">.icon-shuju1</div>
                </li>
            
                <li>
                <i class="icon iconfont icon-hongbao1"></i>
                    <div class="name">红包</div>
                    <div class="fontclass">.icon-hongbao1</div>
                </li>
            
                <li>
                <i class="icon iconfont icon-wenzhang"></i>
                    <div class="name">文章</div>
                    <div class="fontclass">.icon-wenzhang</div>
                </li>
            
                <li>
                <i class="icon iconfont icon-comiisgonggao"></i>
                    <div class="name">公告</div>
                    <div class="fontclass">.icon-comiisgonggao</div>
                </li>
            
                <li>
                <i class="icon iconfont icon-x"></i>
                    <div class="name">x</div>
                    <div class="fontclass">.icon-x</div>
                </li>
            
                <li>
                <i class="icon iconfont icon-chevron-copy-copy-copy-copy-copy-copy"></i>
                    <div class="name">箭头</div>
                    <div class="fontclass">.icon-chevron-copy-copy-copy-copy-copy-copy</div>
                </li>
            
                <li>
                <i class="icon iconfont icon-dianhua3"></i>
                    <div class="name">电话</div>
                    <div class="fontclass">.icon-dianhua3</div>
                </li>
            
                <li>
                <i class="icon iconfont icon-mima-copy"></i>
                    <div class="name">密码</div>
                    <div class="fontclass">.icon-mima-copy</div>
                </li>
            
                <li>
                <i class="icon iconfont icon-jinggao"></i>
                    <div class="name">提示警告</div>
                    <div class="fontclass">.icon-jinggao</div>
                </li>
            
                <li>
                <i class="icon iconfont icon-shuju2"></i>
                    <div class="name">数据</div>
                    <div class="fontclass">.icon-shuju2</div>
                </li>
            
                <li>
                <i class="icon iconfont icon-shuju-copy"></i>
                    <div class="name">数据</div>
                    <div class="fontclass">.icon-shuju-copy</div>
                </li>
            
                <li>
                <i class="icon iconfont icon-gonggao"></i>
                    <div class="name">公告</div>
                    <div class="fontclass">.icon-gonggao</div>
                </li>
            
                <li>
                <i class="icon iconfont icon-xiazai1"></i>
                    <div class="name">下载</div>
                    <div class="fontclass">.icon-xiazai1</div>
                </li>
            
                <li>
                <i class="icon iconfont icon-daohang2"></i>
                    <div class="name">导航2</div>
                    <div class="fontclass">.icon-daohang2</div>
                </li>
            
                <li>
                <i class="icon iconfont icon-shuju3"></i>
                    <div class="name">数据</div>
                    <div class="fontclass">.icon-shuju3</div>
                </li>
            
                <li>
                <i class="icon iconfont icon-xuan"></i>
                    <div class="name">x</div>
                    <div class="fontclass">.icon-xuan</div>
                </li>
            
                <li>
                <i class="icon iconfont icon-49"></i>
                    <div class="name">显示</div>
                    <div class="fontclass">.icon-49</div>
                </li>
            
                <li>
                <i class="icon iconfont icon-tishikuangjingshi"></i>
                    <div class="name">提示框-警示</div>
                    <div class="fontclass">.icon-tishikuangjingshi</div>
                </li>
            
                <li>
                <i class="icon iconfont icon-xiangji1"></i>
                    <div class="name">相机</div>
                    <div class="fontclass">.icon-xiangji1</div>
                </li>
            
                <li>
                <i class="icon iconfont icon-hua1"></i>
                    <div class="name">花</div>
                    <div class="fontclass">.icon-hua1</div>
                </li>
            
                <li>
                <i class="icon iconfont icon-huakong"></i>
                    <div class="name">花－空</div>
                    <div class="fontclass">.icon-huakong</div>
                </li>
            
                <li>
                <i class="icon iconfont icon-shangchuan1"></i>
                    <div class="name">上传</div>
                    <div class="fontclass">.icon-shangchuan1</div>
                </li>
            
                <li>
                <i class="icon iconfont icon-jiantou-copy"></i>
                    <div class="name">箭头</div>
                    <div class="fontclass">.icon-jiantou-copy</div>
                </li>
            
                <li>
                <i class="icon iconfont icon-xianhualipin"></i>
                    <div class="name">鲜花礼品</div>
                    <div class="fontclass">.icon-xianhualipin</div>
                </li>
            
                <li>
                <i class="icon iconfont icon-cross-ivt"></i>
                    <div class="name">x</div>
                    <div class="fontclass">.icon-cross-ivt</div>
                </li>
            
                <li>
                <i class="icon iconfont icon-jiantou-copy1"></i>
                    <div class="name">箭头</div>
                    <div class="fontclass">.icon-jiantou-copy1</div>
                </li>
            
                <li>
                <i class="icon iconfont icon-shuju4"></i>
                    <div class="name">数据</div>
                    <div class="fontclass">.icon-shuju4</div>
                </li>
            
                <li>
                <i class="icon iconfont icon-xiazai2"></i>
                    <div class="name">下载</div>
                    <div class="fontclass">.icon-xiazai2</div>
                </li>
            
                <li>
                <i class="icon iconfont icon-dianhua4"></i>
                    <div class="name">电话</div>
                    <div class="fontclass">.icon-dianhua4</div>
                </li>
            
                <li>
                <i class="icon iconfont icon-lianjie1"></i>
                    <div class="name">链接</div>
                    <div class="fontclass">.icon-lianjie1</div>
                </li>
            
                <li>
                <i class="icon iconfont icon-bianji2"></i>
                    <div class="name">编辑</div>
                    <div class="fontclass">.icon-bianji2</div>
                </li>
            
                <li>
                <i class="icon iconfont icon-xianshi"></i>
                    <div class="name">显示</div>
                    <div class="fontclass">.icon-xianshi</div>
                </li>
            
                <li>
                <i class="icon iconfont icon-hongbao2"></i>
                    <div class="name">红包</div>
                    <div class="fontclass">.icon-hongbao2</div>
                </li>
            
                <li>
                <i class="icon iconfont icon-yonghu-copy"></i>
                    <div class="name">用户</div>
                    <div class="fontclass">.icon-yonghu-copy</div>
                </li>
            
                <li>
                <i class="icon iconfont icon-daohang-copy"></i>
                    <div class="name">导航</div>
                    <div class="fontclass">.icon-daohang-copy</div>
                </li>
            
                <li>
                <i class="icon iconfont icon-edit"></i>
                    <div class="name">编辑</div>
                    <div class="fontclass">.icon-edit</div>
                </li>
            
                <li>
                <i class="icon iconfont icon-bianji3"></i>
                    <div class="name">编辑 </div>
                    <div class="fontclass">.icon-bianji3</div>
                </li>
            
                <li>
                <i class="icon iconfont icon-hua2"></i>
                    <div class="name">花</div>
                    <div class="fontclass">.icon-hua2</div>
                </li>
            
                <li>
                <i class="icon iconfont icon-tongjishuju"></i>
                    <div class="name">统计数据</div>
                    <div class="fontclass">.icon-tongjishuju</div>
                </li>
            
                <li>
                <i class="icon iconfont icon-jinrongye"></i>
                    <div class="name">金融业</div>
                    <div class="fontclass">.icon-jinrongye</div>
                </li>
            
                <li>
                <i class="icon iconfont icon-kongjian-copy"></i>
                    <div class="name">空间</div>
                    <div class="fontclass">.icon-kongjian-copy</div>
                </li>
            
                <li>
                <i class="icon iconfont icon-zhengque-copy"></i>
                    <div class="name">确认/正确/选择</div>
                    <div class="fontclass">.icon-zhengque-copy</div>
                </li>
            
                <li>
                <i class="icon iconfont icon-guanbi-copy"></i>
                    <div class="name">关闭/错误</div>
                    <div class="fontclass">.icon-guanbi-copy</div>
                </li>
            
                <li>
                <i class="icon iconfont icon-jinru-copy"></i>
                    <div class="name">进入</div>
                    <div class="fontclass">.icon-jinru-copy</div>
                </li>
            
                <li>
                <i class="icon iconfont icon-fanhui-copy"></i>
                    <div class="name">返回</div>
                    <div class="fontclass">.icon-fanhui-copy</div>
                </li>
            
                <li>
                <i class="icon iconfont icon-wenhao"></i>
                    <div class="name">问号</div>
                    <div class="fontclass">.icon-wenhao</div>
                </li>
            
                <li>
                <i class="icon iconfont icon-shuju5"></i>
                    <div class="name">数据</div>
                    <div class="fontclass">.icon-shuju5</div>
                </li>
            
                <li>
                <i class="icon iconfont icon-xiangshangfanye"></i>
                    <div class="name">向上翻页</div>
                    <div class="fontclass">.icon-xiangshangfanye</div>
                </li>
            
                <li>
                <i class="icon iconfont icon-xiangxiafanye"></i>
                    <div class="name">向下翻页</div>
                    <div class="fontclass">.icon-xiangxiafanye</div>
                </li>
            
                <li>
                <i class="icon iconfont icon-qita"></i>
                    <div class="name">其他</div>
                    <div class="fontclass">.icon-qita</div>
                </li>
            
                <li>
                <i class="icon iconfont icon-xiaoxi003"></i>
                    <div class="name">消息003</div>
                    <div class="fontclass">.icon-xiaoxi003</div>
                </li>
            
                <li>
                <i class="icon iconfont icon-no"></i>
                    <div class="name">no</div>
                    <div class="fontclass">.icon-no</div>
                </li>
            
                <li>
                <i class="icon iconfont icon-ok"></i>
                    <div class="name">ok</div>
                    <div class="fontclass">.icon-ok</div>
                </li>
            
                <li>
                <i class="icon iconfont icon-angledoubledown"></i>
                    <div class="name">angle-double-down</div>
                    <div class="fontclass">.icon-angledoubledown</div>
                </li>
            
                <li>
                <i class="icon iconfont icon-angledoubleleft"></i>
                    <div class="name">angle-double-left</div>
                    <div class="fontclass">.icon-angledoubleleft</div>
                </li>
            
                <li>
                <i class="icon iconfont icon-angledoubleright"></i>
                    <div class="name">angle-double-right</div>
                    <div class="fontclass">.icon-angledoubleright</div>
                </li>
            
                <li>
                <i class="icon iconfont icon-angledoubleup"></i>
                    <div class="name">angle-double-up</div>
                    <div class="fontclass">.icon-angledoubleup</div>
                </li>
            
                <li>
                <i class="icon iconfont icon-telepphone"></i>
                    <div class="name">电话</div>
                    <div class="fontclass">.icon-telepphone</div>
                </li>
            
                <li>
                <i class="icon iconfont icon-weixin"></i>
                    <div class="name">weixin</div>
                    <div class="fontclass">.icon-weixin</div>
                </li>
            
                <li>
                <i class="icon iconfont icon-weibo3"></i>
                    <div class="name">weibo</div>
                    <div class="fontclass">.icon-weibo3</div>
                </li>
            
                <li>
                <i class="icon iconfont icon-xiazai3"></i>
                    <div class="name">下载</div>
                    <div class="fontclass">.icon-xiazai3</div>
                </li>
            
                <li>
                <i class="icon iconfont icon-gonggao1"></i>
                    <div class="name">公告</div>
                    <div class="fontclass">.icon-gonggao1</div>
                </li>
            
                <li>
                <i class="icon iconfont icon-danqia"></i>
                    <div class="name">单卡</div>
                    <div class="fontclass">.icon-danqia</div>
                </li>
            
                <li>
                <i class="icon iconfont icon-yonghu2"></i>
                    <div class="name">用户</div>
                    <div class="fontclass">.icon-yonghu2</div>
                </li>
            
                <li>
                <i class="icon iconfont icon-weibiaoti560"></i>
                    <div class="name">密码</div>
                    <div class="fontclass">.icon-weibiaoti560</div>
                </li>
            
                <li>
                <i class="icon iconfont icon-qq2"></i>
                    <div class="name">QQ</div>
                    <div class="fontclass">.icon-qq2</div>
                </li>
            
                <li>
                <i class="icon iconfont icon-qq3"></i>
                    <div class="name">qq</div>
                    <div class="fontclass">.icon-qq3</div>
                </li>
            
                <li>
                <i class="icon iconfont icon-mima"></i>
                    <div class="name">密码</div>
                    <div class="fontclass">.icon-mima</div>
                </li>
            
                <li>
                <i class="icon iconfont icon-wenzhang1"></i>
                    <div class="name">文章</div>
                    <div class="fontclass">.icon-wenzhang1</div>
                </li>
            
                <li>
                <i class="icon iconfont icon-jinrongicon"></i>
                    <div class="name">金融-icon</div>
                    <div class="fontclass">.icon-jinrongicon</div>
                </li>
            
                <li>
                <i class="icon iconfont icon-jiazai2"></i>
                    <div class="name">加载</div>
                    <div class="fontclass">.icon-jiazai2</div>
                </li>
            
                <li>
                <i class="icon iconfont icon-jiantou-copy2"></i>
                    <div class="name">箭头</div>
                    <div class="fontclass">.icon-jiantou-copy2</div>
                </li>
            
                <li>
                <i class="icon iconfont icon-dashuju"></i>
                    <div class="name">大数据</div>
                    <div class="fontclass">.icon-dashuju</div>
                </li>
            
                <li>
                <i class="icon iconfont icon-jiantou-copy-copy-copy"></i>
                    <div class="name">箭头</div>
                    <div class="fontclass">.icon-jiantou-copy-copy-copy</div>
                </li>
            
                <li>
                <i class="icon iconfont icon-anzhuosvg"></i>
                    <div class="name">安卓-SVG</div>
                    <div class="fontclass">.icon-anzhuosvg</div>
                </li>
            
                <li>
                <i class="icon iconfont icon-tuichu1"></i>
                    <div class="name">退出</div>
                    <div class="fontclass">.icon-tuichu1</div>
                </li>
            
                <li>
                <i class="icon iconfont icon-tushujiemiandjiazai"></i>
                    <div class="name">D加载</div>
                    <div class="fontclass">.icon-tushujiemiandjiazai</div>
                </li>
            
                <li>
                <i class="icon iconfont icon-yonghu3"></i>
                    <div class="name">用户</div>
                    <div class="fontclass">.icon-yonghu3</div>
                </li>
            
                <li>
                <i class="icon iconfont icon-gonggao2"></i>
                    <div class="name">公告</div>
                    <div class="fontclass">.icon-gonggao2</div>
                </li>
            
                <li>
                <i class="icon iconfont icon-anzhuo"></i>
                    <div class="name">安卓</div>
                    <div class="fontclass">.icon-anzhuo</div>
                </li>
            
                <li>
                <i class="icon iconfont icon-jianpanqiehuandaxiaoxie"></i>
                    <div class="name">键盘切换大小写</div>
                    <div class="fontclass">.icon-jianpanqiehuandaxiaoxie</div>
                </li>
            
                <li>
                <i class="icon iconfont icon-rongzijine"></i>
                    <div class="name">融资金额</div>
                    <div class="fontclass">.icon-rongzijine</div>
                </li>
            
                <li>
                <i class="icon iconfont icon-loading"></i>
                    <div class="name">加载2</div>
                    <div class="fontclass">.icon-loading</div>
                </li>
            
                <li>
                <i class="icon iconfont icon-jinrongfuwu"></i>
                    <div class="name">金融服务</div>
                    <div class="fontclass">.icon-jinrongfuwu</div>
                </li>
            
                <li>
                <i class="icon iconfont icon-iconfontmoban"></i>
                    <div class="name">警告提示</div>
                    <div class="fontclass">.icon-iconfontmoban</div>
                </li>
            
                <li>
                <i class="icon iconfont icon-buxianshi"></i>
                    <div class="name">不显示</div>
                    <div class="fontclass">.icon-buxianshi</div>
                </li>
            
                <li>
                <i class="icon iconfont icon-pingguo"></i>
                    <div class="name">苹果</div>
                    <div class="fontclass">.icon-pingguo</div>
                </li>
            
                <li>
                <i class="icon iconfont icon-shanchu11"></i>
                    <div class="name">删除</div>
                    <div class="fontclass">.icon-shanchu11</div>
                </li>
            
                <li>
                <i class="icon iconfont icon-shanchujiantou"></i>
                    <div class="name">删除箭头</div>
                    <div class="fontclass">.icon-shanchujiantou</div>
                </li>
            
                <li>
                <i class="icon iconfont icon-daxiaoxiezhuanhuan"></i>
                    <div class="name">大小写转换</div>
                    <div class="fontclass">.icon-daxiaoxiezhuanhuan</div>
                </li>
            
                <li>
                <i class="icon iconfont icon-wuneirong_123"></i>
                    <div class="name">无内容_123</div>
                    <div class="fontclass">.icon-wuneirong_123</div>
                </li>
            
                <li>
                <i class="icon iconfont icon-baoxian"></i>
                    <div class="name">保险</div>
                    <div class="fontclass">.icon-baoxian</div>
                </li>
            
                <li>
                <i class="icon iconfont icon-tanhao"></i>
                    <div class="name">叹号</div>
                    <div class="fontclass">.icon-tanhao</div>
                </li>
            
                <li>
                <i class="icon iconfont icon-jiantou"></i>
                    <div class="name">箭头</div>
                    <div class="fontclass">.icon-jiantou</div>
                </li>
            
                <li>
                <i class="icon iconfont icon-xiangzuojiantou"></i>
                    <div class="name">向左箭头</div>
                    <div class="fontclass">.icon-xiangzuojiantou</div>
                </li>
            
                <li>
                <i class="icon iconfont icon-tanhao1"></i>
                    <div class="name">叹号</div>
                    <div class="fontclass">.icon-tanhao1</div>
                </li>
            
                <li>
                <i class="icon iconfont icon-jiantou1"></i>
                    <div class="name">箭头</div>
                    <div class="fontclass">.icon-jiantou1</div>
                </li>
            
                <li>
                <i class="icon iconfont icon-zuoyoujiantou-"></i>
                    <div class="name">左右箭头</div>
                    <div class="fontclass">.icon-zuoyoujiantou-</div>
                </li>
            
        </ul>

        <h2 id="font-class-">font-class引用</h2>
        <hr>

        <p>font-class是unicode使用方式的一种变种，主要是解决unicode书写不直观，语意不明确的问题。</p>
        <p>与unicode使用方式相比，具有如下特点：</p>
        <ul>
        <li>兼容性良好，支持ie8+，及所有现代浏览器。</li>
        <li>相比于unicode语意明确，书写更直观。可以很容易分辨这个icon是什么。</li>
        <li>因为使用class来定义图标，所以当要替换图标时，只需要修改class里面的unicode引用。</li>
        <li>不过因为本质上还是使用的字体，所以多色图标还是不支持的。</li>
        </ul>
        <p>使用步骤如下：</p>
        <h3 id="-fontclass-">第一步：引入项目下面生成的fontclass代码：</h3>


        <pre><code class="lang-js hljs javascript"><span class="hljs-comment">&lt;link rel="stylesheet" type="text/css" href="./iconfont.css"&gt;</span></code></pre>
        <h3 id="-">第二步：挑选相应图标并获取类名，应用于页面：</h3>
        <pre><code class="lang-css hljs">&lt;<span class="hljs-selector-tag">i</span> <span class="hljs-selector-tag">class</span>="<span class="hljs-selector-tag">iconfont</span> <span class="hljs-selector-tag">icon-xxx</span>"&gt;&lt;/<span class="hljs-selector-tag">i</span>&gt;</code></pre>
        <blockquote>
        <p>"iconfont"是你项目下的font-family。可以通过编辑项目查看，默认是"iconfont"。</p>
        </blockquote>
    </div>
</body>
</html>
